<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>编辑-在线相册信息管理</title>
  <script type="text/javascript" src="/static/js/jquery-1.8.2.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $('#reset').click(function(){
        $('#show').attr('src','/static/pics/error.png');
      });
    });
  </script>
</head>
<body bgcolor="#02326B" link="balck" alink="red" vlink="black">
	<center>
		{% include 'myphoto/menuphoto.html'%}

		<h3>修改用户信息</h3>
    <form action="{% url 'updatephoto' %}" method="post" enctype="multipart/form-data">
      <input type="hidden" name="id" value="{{ pinfo.id}}"/>
      {% csrf_token %}
      <table  border="0">
        <tr>
          <td width="60" align="center">标题：</td>
          <td ><input align="center" type="text" name="title" value="{{ pinfo.title }}"/></td>
        </tr>
        <tr>
          <td align="center">图片：</td>
          <!-- 原来的图片 -->
          <!-- <td><input type="text" name="picture"  value="{{ pinfo.picture }}"/></td> -->
          <input type="hidden" name="oldpic" value="{{pinfo.picture}}">
          <td><img src="/static/pics/{{ pinfo.picture }}"></td>
        </tr>
        <tr>
          <!-- 修改后的图片 -->
          <td align="center">修改：</td>
          <td><input id="file" type="file" class="filepath" onchange="changepic(this)" accept="image/*" name="pic" value=""></td>
          <!-- <td><img src="/static/pics/error.png"></td> -->
        </tr>
        <tr>
          <td></td>
          <td><img id="show" height="75" src="/static/pics/error.png"></td>
        </tr>
        <tr>
          <td></td>
          <td colspan="2">
            <input type="submit" value="修改"/>
            <input id="reset" type="reset" value="重置"/>
          </td>
        </tr>
      </table>
    </form>
    <hr>
    <!-- 为什么这个资源路径前加'.'号就不行，而addphoto页面就行 -->
    <!-- <img id="show" width="200" src="/static/pics/{{ pinfo.picture }}"> -->
    <script>
      function changepic() {
        var reads= new FileReader();
        f=document.getElementById('file').files[0];
        reads.readAsDataURL(f);
        reads.onload=function (e) {
          document.getElementById('show').src=this.result;
        };
      }
    </script>
	</center>
</body>
</html>